<!-- <template>
  <div class="show-editor">
    <div class="editor-part">
      <div class="editor-area">
        <textEditor @catchData="catchData" ref="editorRef"></textEditor>
      </div>
      <div class="operation-part">
        <div class="opera-btns">
          <p class="show-btn">获取编辑器html：</p>
          <p class="show-content">{{ editorContentObj.htmlContent }}</p>
        </div>
        <div class="opera-btns">
          <p class="show-btn">获取编辑器text：</p>
          <p class="show-content">{{ editorContentObj.textContent }}</p>
        </div>
        <div class="opera-btns">
          <p class="show-btn cp" @click="clearEditor">清空编辑器内容</p>
        </div>
      </div>
    </div>
    <div v-html="editorContentObj.htmlContent"></div>
  </div>
</template>

<script>
import textEditor from "@/views/components/editors/index.vue";

export default {
  name: "testWangeditor",
  components: {
    textEditor,
  },
  data() {
    return {
      editorContentObj: {
        htmlContent: "",
        textContent: "",
      },
    };
  },
  methods: {
    // 获取子组件传值
    catchData(content, text) {
      this.editorContentObj = {
        htmlContent: content,
        textContent: text,
      };

      let str2 = content.replaceAll("h4", "input");
      this.editorContentObj.htmlContent = str2;
      console.log(typeof content);
    },
    // 清空编辑器内容
    clearEditor() {
      this.$refs.editorRef.editor.txt.clear();
    },
  },
};
</script>

<style scoped>
.cp {
  cursor: pointer;
  color: #2aa4f1;
}
.show-editor {
  background-color: #ffffff;
  height: 100vh;
}

.editor-part {
  width: 80%;
  margin: auto;
}

.editor-part .title {
  text-align: center;
}

.editor-part .title h1 {
  font-size: 18px;
}

.operation-part {
  margin-top: 20px;
}

.operation-part .opera-btns {
  margin-bottom: 10px;
  display: flex;
}
</style> -->
<!-- 富文本和编辑器 -->
<!-- <template>
  <div style="border: 1px solid #ccc">
    <Toolbar
      style="border-bottom: 1px solid #ccc"
      :editor="editor"
      :defaultConfig="toolbarConfig"
      :mode="mode"
    />
    <Editor
      id="testEditor"
      style="height: 500px; overflow-y: hidden"
      v-model="html"
      :defaultConfig="editorConfig"
      :mode="mode"
      @onCreated="onCreated"
    />

    <el-button @click="submoit">保存</el-button>
    <el-button @click="confirm">确定</el-button>
    <div v-html="str"></div>
    <el-input v-model="textareas" :rows="5" type="textarea"></el-input>
  </div>
</template>
<script>
import "@wangeditor/editor/dist/css/style.css"; // 引入 css
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
export default {
  components: { Editor, Toolbar },
  data() {
    return {
      textareas: "",
      htmls:
        "<el-radio-group v-model='radio'><el-radio :label='3'>备选项</el-radio><el-radio :label='6'>备选项</el-radio><el-radio :label='9'>备选项</el-radio></el-radio-group>",
      editor: null,
      html: "<input type=checkbox disabled >",

      toolbarConfig: {
        excludeKeys: [
          // 排除菜单组，写菜单组 key 的值即可
          "group-video", //去掉视频
          "group-image",
        ],
        insertKeys: ["menu-key1"],
      },
      editorConfig: { placeholder: "请输入内容..." },
      mode: "default", // or 'simple',
      str: "",
      arrays: [],
      selectIndex: 0,
    };
  },
  methods: {
    changes() {
      console.log("ppp");
    },
    confirm() {
      console.log(this.html);
      console.log(this.textareas);
      console.log(this.textareas.split("\n").length);
      console.log(this.textareas.split("\n"));
      let datas = this.textareas.split("\n");
      for (var i = 0; i < datas.length; i++) {
        if (datas[i].includes("□")) {
          console.log(datas[i]);
          let datasplit = datas[i];
          var reg1 = new RegExp("□", "g"); // 加'g'，删除字符串里所有的"a"
          var a1 = datasplit.replace(reg1, "");
          console.log(a1);
          console.log(a1.split(" "));
          let a2;
          a2 = a1.split(" ").filter((item) => item != "");
          console.log(a2);
          for (let j = 0; j < a2.length; j++) {
            this.str += `<input type=radio name='radio'>${a2[j]}</input>`;
          }
          this.str += `<input type='text' name='myinput'></input>`;
          // 获取□的个数
          console.log(this.findCharPositions(datas[i], "□"));
        } else if (datas[i].includes("    ")) {
          console.log(datas[i]);
          var reg1 = new RegExp("    ", "g"); // 加'g'，删除字符串里所有的"a"
          var a1 = datas[i].replace(reg1, "");
          console.log(a1, "a1");
          let a2;
          a2 = a1.split(" ").filter((item) => item != "");
          console.log(a2);
          for (let j = 0; j < a2.length; j++) {
            this.str += `${a2[j]}<input type='text' name='myinput'></input>`;
          }
        } else {
          this.str += `<p>${datas[i]}</p>`;
        }
      }

      // console.log(this.str);
      // const radios = document.querySelectorAll('input[type="radio"]');
      // var input = document.querySelector('input[type="text"]');
      // var inputValue = input.value;
      // console.log(inputValue);
      // var radios = document.getElementsByName("radio");
      // let dataArr = radios;
      // let _this = this;
      // radios.forEach((item, index) => {
      //   item.addEventListener("change", function () {
      //     dataArr.forEach((items, indexs) => {
      //       if (index == indexs) {
      //         item.setAttribute("checked", "true");
      //       } else {
      //         item.setAttribute("checked", "false");
      //       }
      //     });
      //     console.log(dataArr);
      //     console.log(_this.str);
      //   });
      // });
      // console.log(_this.str);
    },
    findCharPositions(str, char) {
      let positions = [];
      for (let i = 0; i < str.length; i++) {
        if (str[i] === char) {
          positions.push(i);
        }
      }
      return positions;
    },
    submoit() {
      console.log(this.str);
      var inputs = document.getElementsByName("myinput");
      for (let j = 0; j < inputs.length; j++) {
        console.log(inputs[j].value);
      }
      console.log(this.html);
      // this.htmls = this.html;
      var reg1 = new RegExp("□", "g"); // 加'g'，删除字符串里所有的"a"
      var a1 = this.html.replace(reg1, "<input type=checkbox></input>");
      console.log(a1);
      this.htmls = `<p style="text-align: left;"><span style="font-family: 宋体;">弹簧（16）数量：</span><u> &nbsp; &nbsp; &nbsp; &nbsp;</u><span style="font-family: 宋体;">件 &nbsp; &nbsp; &nbsp;<input type=checkbox></input>合格</span><u> &nbsp; &nbsp;</u><span style="font-family: 宋体;">件 &nbsp; &nbsp; &nbsp;<input type=checkbox></input>不合格</span><u> &nbsp; &nbsp;</u><span style="font-family: 宋体;">件 &nbsp; &nbsp; <input type=checkbox></input>不涉及</span></p>`;
      // console.log(this.html.split("</p>"));
      // let htmlArray = this.html.split("</p>").filter((item) => item != "");
      // var testEditor = document.getElementById("testEditor");
      // var spanElements = testEditor.getElementsByTagName("p");
      // 删除p标签    spanElements.parentNode.removeChild(p);
      // for (var i = 0; i < spanElements.length; i++) {
      //   // 获取p标签的内容
      //   var spanContent = spanElements[i].textContent;
      //   console.log(spanContent);
      //   if (spanElements && spanContent.includes("□")) {
      //     // console.log(i, spanContent);
      //     var reg1 = new RegExp("□", "g"); // 加'g'，删除字符串里所有的"a"
      //     var a1 = spanContent.replace(reg1, "");
      //     let a2;
      //     a2 = a1.split(" ").filter((item) => item != "");
      //     let aaa = "";
      //     for (let j = 0; j < a2.length; j++) {
      //       aaa += `<input type=checkbox name='checkbox' value=${a2[j]}>${a2[j]}</input>`;
      //     }
      //     // aaa += `<input type=text></input>`;
      //     htmlArray[i] = `<p>${aaa}`;
      //     let newArray = [];
      //     htmlArray.forEach((item) => {
      //       item = item + "</p>";
      //       newArray.push(item);
      //     });
      //     // console.log(newArray);
      //     let showhtml = newArray.join(" ");
      //     // let str2 = this.html.replaceAll("h4", "input");
      //     // this.html = str2;
      //     // console.log(str2);
      //     console.log(showhtml);
      //     this.str = showhtml;
      //   }
      // }

      // for (var i = 0; i < spanElements.length; i++) {
      //   var spanContent = spanElements[i].textContent;
      //   if (spanElements && spanContent.includes("□")) {
      //     //  // 带有□的第几个p标签
      //     console.log(i);
      //     // 带有□的内容
      //     console.log(spanContent);
      //     // 带有□的p标签
      //     var ments = testEditor.getElementsByTagName("p")[i];
      //     console.log(ments);
      //     ments.parentNode.removeChild(ments);
      //     console.log(this.html, "delete");
      //     // let data = spanContent.split("□");
      //     // console.log(data);
      //     // let html = [];
      //     // for (let k = 0; k < data.length; k++) {
      //     //   html.push(`<input type=radio>${data[k]}</input>`);
      //     // }
      //   }
      // }

      // this.html = "<input type='checkbox'  checked value='ddd'>";
    },
    onCreated(editor) {
      this.editor = Object.seal(editor); // 一定要用 Object.seal() ，否则会报错
    },
  },
  mounted() {
    // 模拟 ajax 请求，异步渲染编辑器
    // setTimeout(() => {
    //   this.html = "<p>模拟 Ajax 异步设置内容 HTML</p>";
    // }, 1500);
  },
  beforeDestroy() {
    const editor = this.editor;
    if (editor == null) return;
    editor.destroy(); // 组件销毁时，及时销毁编辑器
  },
};
</script> -->

<!-- <template>
	<div>
		<ckeditor
      ref="refCKEditor"
      :config="config"
      v-model="editorData"
      :read-only="readOnly"
      :throttle="120"
      :editor-url="editorUrl"
      id="testEditor"
    ></ckeditor>
		<el-button @click="submitw">确定</el-button>
		<el-button @click="confirm">确定数据</el-button>

		<div class="father" @click="submitw">
			获取
			<div id="son" v-html="contentaaaa" @input="inputData($event)"></div>
		</div>
	</div>
</template> -->

<!-- <script>
import CKEditor from "ckeditor4-vue"
export default {
	name: "Editor",
	components: {
		// Use the <ckeditor> component in this view.
		ckeditor: CKEditor.component
	},
	props: {
		//内容
		value: {
			type: String,
			default: ""
		},
		readOnly: {
			type: Boolean,
			default: false
		},
		config: {
			type: Object,
			default: () => {
				return {
					// 工具栏
					toolbarGroups: [
						{ name: "document", groups: ["mode", "document", "doctools"] },
						{ name: "clipboard", groups: ["clipboard", "undo"] },
						{
							name: "editing",
							groups: ["find", "selection", "spellchecker", "editing"]
						},
						{ name: "forms", groups: ["forms"] },
						{ name: "basicstyles", groups: ["basicstyles", "cleanup"] },
						{
							name: "paragraph",
							groups: ["list", "indent", "blocks", "align", "bidi", "paragraph"]
						},
						{ name: "links", groups: ["links"] },
						{ name: "insert", groups: ["insert"] },
						{ name: "styles", groups: ["styles"] },
						{ name: "colors", groups: ["colors"] },
						{ name: "tools", groups: ["tools"] },
						{ name: "others", groups: ["others"] },
						{ name: "about", groups: ["about"] }
					],
					//   extraPlugins: "notification",
					//   // toolbar 中的一些配置功能 需要在这里添加一下才可以用 例如 print colorbutton
					extraPlugins: "print,format,font,colorbutton,justify,uploadimage,notification",
					// 删除的工具栏
					// Checkbox,Radio,TextField,Source,Form
					removeButtons: "Form,Save,NewPage,ExportPdf,Preview,Print,Templates,Cut,Copy,Paste,PasteText,PasteFromWord,Undo,Redo,Replace,Find,SelectAll,Scayt,Textarea,Select,Button,ImageButton,HiddenField,Subscript,Superscript,CopyFormatting,Outdent,Indent,CreateDiv,Blockquote,BidiLtr,BidiRtl,Language,Unlink,Link,Anchor,HorizontalRule,Smiley,SpecialChar,PageBreak,Iframe,ShowBlocks,About,FontSize,Font"
				}
			}
		}
	},
	data() {
		return {
			contents: "<p><input type='text' /><span>eee</span><input type='checkbox' /></p>",
			content:
				'<p style="text-align:justify"><strong><strong>一、确认送修原因</strong></strong><strong><strong>及产品型号</strong></strong><strong><strong>：</strong></strong></p>\n\n<p style="text-align:left">&nbsp; （1）确认工作单与返修任务单中产品型号是否一致：&nbsp;</p>\n\n<p style="text-align:left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;<input type="checkbox" />是<input type="checkbox" />否<input type="text" /></p>\n\n<p style="text-align:left">&nbsp; &nbsp;（2）记录汽缸座及刹车壳体炉号：</p>\n\n<p style="text-align:left">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;汽缸座炉号：<input type="text" />&nbsp; &nbsp;刹车壳体炉号：<input type="text" /></p>\n\n<p style="text-align:justify"><strong><strong>二、产品送修状态检查：</strong></strong></p>\n\n<p style="text-align:justify"><strong><strong>&nbsp; &nbsp;</strong></strong>（1）<strong><strong>&nbsp;</strong></strong>分解前进行原始状态检查，检查刹车装置有无零部件丢失、失效、磕碰或其它明显的缺陷。将检查结果填入下表</p>\n\n<p style="text-align:justify">&nbsp; &nbsp;</p>\n\n<table align="center" cellspacing="0" class="Table" style="border-collapse:collapse; border:none; font-family:&quot;Times New Roman&quot;; font-size:13px; width:516px">\n\t<tbody>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">序号</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:98px">\n\t\t\t<p style="margin-right:-1px; text-align:center">项 目</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:383px">\n\t\t\t<p style="margin-right:-1px; text-align:center">检 查 结 果</p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">1</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px">\n\t\t\t<p style="margin-right:-1px; text-align:center">外观质量</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px">\n\t\t\t<p style="text-align:left"><input type="checkbox" />合格</p>\n\n\t\t\t<p style="margin-right:-1px; text-align:left"><input type="checkbox" />不合格<input type="text" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">2</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px">\n\t\t\t<p style="margin-right:-1px; text-align:center">有无缺件</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px">\n\t\t\t<p style="text-align:left"><input type="checkbox" />合格 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>\n\n\t\t\t<p style="margin-right:-1px; text-align:left"><input type="checkbox" />不合格<input type="text" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">3</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px">\n\t\t\t<p style="margin-right:-1px; text-align:center">活塞有无卡滞、漏油现象</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px">\n\t\t\t<p style="text-align:left"><input type="checkbox" />合格&nbsp; &nbsp; &nbsp;<input type="checkbox" />不涉及 &nbsp;</p>\n\n\t\t\t<p style="margin-right:-1px; text-align:left"><input type="checkbox" />不合格<input type="text" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">4</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px">\n\t\t\t<p style="text-align:center">刹车盘情况</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px">\n\t\t\t<p style="text-align:left">是否带碳刹车盘：<input type="checkbox" />□是 &nbsp;<input type="checkbox" />□否&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刹车盘是否到寿：<input type="checkbox" />□是 <input type="checkbox" />&nbsp;□否</p>\n\n\t\t\t<p style="text-align:left">是否加装调整垫盘：<input type="checkbox" />是 &nbsp;<input type="checkbox" />否 &nbsp;&nbsp;是否需更换两片静盘：<input type="checkbox" />是 <input type="checkbox" />&nbsp;否</p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px">\n\t\t\t<p style="margin-left:-1px; margin-right:-7px; text-align:center">5</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px">\n\t\t\t<p style="text-align:center">备注</p>\n\t\t\t</td>\n\t\t\t<td style="border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px">\n\t\t\t<p style="margin-right:-1px; text-align:left">&nbsp;</p>\n\n\t\t\t<p style="margin-right:-1px; text-align:left">&nbsp;</p>\n\t\t\t</td>\n\t\t</tr>\n\t</tbody>\n</table>\n\n<p style="text-align:justify">&nbsp; &nbsp;</p>\n\n<p style="text-align:left">&nbsp;</p>\n',
			contentaaaa: `<p style=\"text-align:justify\"><strong><strong>二、产品送修状态检查：</strong></strong></p>\n\n<ol>\n\t<li style=\"text-align:left\">分解前进行原始状态检查，检查刹车装置有无零部件丢失、失效、磕碰或其它明显的缺陷。将检查结果填入下表。</li>\n</ol>\n\n<table align=\"center\" cellspacing=\"0\" class=\"Table\" style=\"border-collapse:collapse; border:none; font-family:&quot;Times New Roman&quot;; font-size:13px; width:516px\">\n\t<tbody>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">序号</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:98px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:center\">项 目</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:1px solid black; vertical-align:center; width:383px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:center\">检 查 结 果</p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">1</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:center\">外观质量</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px\">\n\t\t\t<p style=\"text-align:left\"><input type=\"checkbox\" />合格 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>\n\n\t\t\t<p style=\"margin-right:-1px; text-align:left\"><input type=\"checkbox\" />不合格<input name=\"\" type=\"text\" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">2</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:center\">有无缺件</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px\">\n\t\t\t<p style=\"text-align:left\"><input type=\"checkbox\" />合格 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</p>\n\n\t\t\t<p style=\"margin-right:-1px; text-align:left\"><input type=\"checkbox\" />不合格<input name=\"\" type=\"text\" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">3</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:center\">活塞有无卡滞、漏油现象</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px\">\n\t\t\t<p style=\"text-align:left\"><input type=\"checkbox\" />合格 &nbsp;&nbsp;&nbsp;&nbsp;<input type=\"checkbox\" />不涉及 &nbsp;</p>\n\n\t\t\t<p style=\"margin-right:-1px; text-align:left\"><input checked=\"checked\" type=\"checkbox\" />不合格<input name=\"\" type=\"text\" /></p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">4</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px\">\n\t\t\t<p style=\"text-align:center\">刹车盘情况</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px\">\n\t\t\t<p style=\"text-align:left\">是否带碳刹车盘：<input type=\"checkbox\" />是 &nbsp;<input type=\"checkbox\" />否&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;刹车盘是否到寿：<input type=\"checkbox\" />是 &nbsp;<input type=\"checkbox\" />否</p>\n\n\t\t\t<p style=\"text-align:left\">是否加装调整垫盘：<input type=\"checkbox\" />是 &nbsp;<input type=\"checkbox\" />否 &nbsp;&nbsp;是否需更换两片静盘：<input type=\"checkbox\" />是 &nbsp;<input type=\"checkbox\" />否</p>\n\t\t\t</td>\n\t\t</tr>\n\t\t<tr>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:35px\">\n\t\t\t<p style=\"margin-left:-1px; margin-right:-7px; text-align:center\">5</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:98px\">\n\t\t\t<p style=\"text-align:center\">备注</p>\n\t\t\t</td>\n\t\t\t<td style=\"border-bottom:1px solid black; border-left:1px solid black; border-right:1px solid black; border-top:none; vertical-align:center; width:383px\">\n\t\t\t<p style=\"margin-right:-1px; text-align:left\">&nbsp;</p>\n\n\t\t\t<p style=\"margin-right:-1px; text-align:left\">&nbsp;</p>\n\t\t\t</td>\n\t\t</tr>\n\t</tbody>\n</table>\n\n<p style=\"margin-left:6px; text-align:justify\"><strong>&nbsp;说明</strong><strong>：逐项检查记录时，有缺件时应记录缺件数量</strong><strong>，</strong><strong>外观有磕碰伤</strong><strong>等缺陷</strong><strong>时，应记录磕碰伤位置及损伤程度。</strong></p>\n`,

			values: [],
			str: "",
			editorData: this.value,
			editorUrl: "/ckeditor/ckeditor.js" //将指令的值更改为指向所需的 CKEditor 4 脚本位置来更改
		}
	},

	computed: {},

	beforeMount() {},

	mounted() {},

	methods: {
		inputData(event) {
			console.log(event)
			console.log(event.target.value)
			let type = event.target.type
			let input = document.getElementById(event.target.id)
			if (type == "text") {
				input.setAttribute("value", event.target.value)
			} else {
				input.setAttribute("checked", event.target.checked)
			}
			input.innerHTML = event.target.outerHTML
			var htmlStr = document.getElementById("son").innerHTML // 获取HTML字符串
			console.log(htmlStr)

			// 替换HTML字符串中的内容

			// var regx = /<[^>]*>/g // 匹配HTML标签的正则表达式
			// var tagArr = htmlStr.match(regx) // 获取所有HTML标签
			// for (var i = 0; i < tagArr.length; i++) {
			// 	var tag = tagArr[i]
			// 	var content = tag.replace(/<[^>]*>/g, "") // 获取标签里的内容
			// 	console.log(htmlStr)
			// 	var newContent = content + "new" // 替换标签里的内容
			// 	console.log(content, newContent)
			// 	console.log(content, newContent)
			// 	htmlStr = htmlStr.replace(content, newContent) // 替换HTML字符串中的内容
			// }
			// console.log(htmlStr)
			// document.getElementById("son").innerHTML = htmlStr // 更新HTML字符串
		},
		confirm() {
			console.log(this.content)
		},
		submitw() {
			var testEditor = document.getElementById("son")
			var obj = testEditor.getElementsByTagName("input")
			Array.prototype.forEach.call(obj, function (v, index) {
				// console.log(v, index)
				v.id = index
			})
		},
		// 事件 onNamespaceLoaded
		onNamespaceLoaded(CKEDITOR) {
			console.log("CKEDITOR", CKEDITOR)
			//   CKEDITOR.plugins.addExternal(
			//     "timestamp",
			//     "/ckeditor/wordcount",
			//     "plugin.js"
			//   );
		}
	},

	watch: {}
}
</script>
<style lang="scss" scoped></style> -->

<template>
	<div class="aa">
		<!-- <img src="../assets/images/indexImg.png" alt="" /> -->
	</div>
</template>
<style scoped lang="scss">
.aa {
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: url("../assets/images/indexImg.png") no-repeat center;
	background-size: contain;
	background-position: center;
	position: relative;
}
</style>
